<template>
    <div class="list">
        <!-- v-for循环遍历orders 数组中的每个 order 对象 -->
<template v-for="order in orders">
    <!-- import OrderItem 用于展示单个订单的内容   -->
    <order-item :order="order" style="margin-bottom: 5px"></order-item>
</template>
    </div>
</template>

<!--我的订单-->
<script>
    import OrderItem from "@/components/OrderItem";
    import API from "@/utils/request";
    export default {
        name: "OrderList",
        data(){
          return{

              orders: {},
          }
        },
        components:{
            'order-item': OrderItem,
        },
        created() {//后端获取用户的订单数据
            API.get("/userid").then(res=>{
                API.get("/api/order/userid/"+ res).then(res=>{
                    if(res.code==='200'){
                        this.orders = res.data;
                        console.log(this.orders)
                    }
                })
            })
        },

    }
</script>

<style scoped>
    .list{
        width: 60%;
        margin: 10px auto;

    }
</style>